<script setup lang="ts">
import type { AppTypeProps } from '@/types';

import { onMounted, ref } from 'vue';
// import { type ComponentInternalInstance, getCurrentInstance } from 'vue';

import { Icon } from '@/components/core/icon';

import Dock from '@/components/web-os/Dock.vue';
import { useAppStore } from '@/store';

// const { proxy } = getCurrentInstance() as ComponentInternalInstance;

import AppModel from '@/model/app';

defineOptions({
  name: 'Launchpad',
});

const emits = defineEmits(['launchpad']);
const deskTopAppList = ref<Array<AppTypeProps>>();
const appStore = useAppStore();
onMounted(() => {
  deskTopAppList.value = AppModel.allAppList; // proxy?.$tool.getDeskTopApp() as Array<AppTypeProps>;
  appStore.getDockAppList();
});
const launchpad = () => {
  emits('launchpad', appStore.launchpad);
};
defineExpose({
  launchpad,
});
</script>

<template>
  <div class="launchpad">
    <div class="body">
      <div class="header">启动台</div>
      <div class="launchpad-app">
        <template v-for="item in deskTopAppList" :key="item.key">
          <div
            v-if="!item.hideInDesktop"
            class="app-item"
            @dblclick="appStore.openApp(item)"
          >
            <div class="icon">
              <i
                v-if="item.iconType === 'icon'"
                :style="{
                  backgroundColor: item.iconBgColor,
                  background: item.iconBgImage,
                  color: item.iconColor,
                }"
                class="iconfont"
              >
                <Icon :icon="item.icon" />
              </i>
              <i
                v-else
                :class="item.icon"
                :style="{
                  backgroundColor: item.iconBgColor,
                  color: item.iconColor,
                }"
                class="iconfont"
              ></i>
            </div>
            <div class="title">{{ item.title }}</div>
          </div>
        </template>
      </div>
    </div>
    <Dock />
  </div>
</template>

<style lang="scss" scoped>
@import url('./css/LaunchPad.scss');
</style>
